{% extends 'users/base.html' %}

{% block title %}User Roles{% endblock %}

{% block card_content %}
<div class="table-responsive">
    <table class="table table-striped">
        <thead>
            <tr>
                <th>Name</th>
                <th>Permissions</th>
                <th>Users</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            {% for role in roles %}
            <tr>
                <td>{{ role.name }}</td>
                <td>
                    {% if role.permissions.all %}
                        <div class="permissions-list">
                            {% for perm in role.permissions.all|slice:":3" %}
                                <span class="badge bg-secondary">{{ perm.name }}</span>
                            {% endfor %}
                            {% if role.permissions.count > 3 %}
                                <span class="badge bg-info">+{{ role.permissions.count|add:"-3" }} more</span>
                            {% endif %}
                        </div>
                    {% else %}
                        <span class="text-muted">No permissions</span>
                    {% endif %}
                </td>
                <td>
                    <span class="badge bg-primary">{{ role.user_set.count }} user{{ role.user_set.count|pluralize }}</span>
                </td>
                <td>
                    <a href="{% url 'users:role_detail' role.pk %}" class="btn btn-sm btn-info">View</a>
                    {% if request.user.is_superuser %}
                    <a href="{% url 'users:role_update' role.pk %}" class="btn btn-sm btn-warning">Edit</a>
                    <a href="{% url 'users:role_delete' role.pk %}" class="btn btn-sm btn-danger" 
                       onclick="return confirm('Are you sure you want to delete this role?')">Delete</a>
                    {% endif %}
                </td>
            </tr>
            {% empty %}
            <tr>
                <td colspan="4" class="text-center">No roles found.</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
{% endblock %}

{% block card_footer %}
{% if request.user.is_superuser %}
<a href="{% url 'users:role_create' %}" class="btn btn-primary">
    <i class="fas fa-plus"></i> Add New Role
</a>
{% endif %}
{% endblock %}